import React, { memo } from 'react'
import { footerLinks, footerImages } from '@/common/local-data';

import { 
    FooterWrapper,
    FooterLeftWrapper,
    FooterRightWrapper
} from './style';


export default memo(function Footer() {
    return (
        <FooterWrapper>
            <div className="wrap-v1 content">
                <FooterLeftWrapper>
                    <div className="lineView">
                        {
                            footerLinks.map((item, index) => {
                                return <span key={item.title}>
                                    <a href={item.link} target="_blank" rel="noreferrer" className="top_a">{item.title}</a>
                                    {
                                        index !== footerLinks.length - 1 ? <span className='line'>|</span> : null
                                    }
                                </span>
                            })
                        }
                    </div>
                    <div className="lineView bottom">
                        <span className="right-padding">网易公司版权所有©1997-2021</span>
                        <span>杭州乐读科技有限公司运营：<a href="https://p5.music.126.net/obj/wo3DlcOGw6DClTvDisK1/8282703158/452a/ca0c/3a10/caad83bc8ffaa850a9dc1613d74824fc.png">浙网文[2021] 1186-054号</a></span>
                    </div>
                    <div className="lineView bottom">
                        <span className="right-padding">违法和不良信息举报电话：0571-89853516</span>
                        <span> 举报邮箱：<a href="mailto:ncm5990@163.com">ncm5990@163.com</a></span>
                    </div>
                    <div className="lineView bottom" >
                        <a className="right-padding" href="https://beian.miit.gov.cn/#/Integrated/index">粤B2-20090191-18  工业和信息化部备案管理系统网站</a>
                        <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=33010902002564"><span className='logo'>
                            
                            </span>浙公网安备 33010902002564号</a>
                    </div>
                </FooterLeftWrapper>
                <FooterRightWrapper>
                {
                    footerImages.map((item, index) => {
                        return <div key={item.link} className="icon_wrapper">
                            <a href={item.link} target="_blank" rel="noreferrer">
                                {/* <div className="icon"></div> */}
                                <div className={`icon icon_position_${index}`}></div>
                            </a>
                            <span>{item.title}</span>
                        </div>
                    })
                }
                </FooterRightWrapper>
            </div>
        </FooterWrapper>
    )
})
